<template>

  <ul>
    <li v-for="(i,index) in news" :key="index">{{ i }} <input type="text"></li>

  </ul>
</template>

<script>
export default {
  name: "News",
  data(){
    return{
      news:[
         'news001' ,
         'news002' ,
         'news003'
      ]
    }
  },
  mounted() {
    console.log(this)
  },
  beforeDestroy() {
    console.log('News,beforeDestroy')
  },
  // 当前路由激活
  activated() {
    console.log('activated',this)

    this.timer = setInterval(()=>{
      console.log(1)
    })
  },
  // 当前路由失活
  deactivated() {
    console.log('deactivated',this)
    clearInterval(this.timer)
  },
  // beforeEnter之后执行
  beforeRouteEnter(to,from,next){
    // 无法获取this，因为当前实例还未创建
    console.log('beforeRouteEnter',this,to,from,next)
    next(vc => {
      console.log('vm',vc)
    })

    // next(false)

    // next()
  },
  beforeRouteLeave(to,form,next){
    console.log('beforeRouteLeave',this,to,form,next)
    next()
  }
}
</script>

<style scoped>

</style>
